import React, {useEffect, useState} from 'react';
import {
  View,
  Text,
  TouchableOpacity,
  ScrollView,
  TextInput,
} from 'react-native';
import XPay from 'react-native-puti-pay';
import {createOrder, alipayAppPay} from '../../service/home';
import {useNavigation} from '@react-navigation/native';
import AreaView from '../../components/Layout/AreaView';
import {List, Toast, Picker} from '@ant-design/react-native';
import {enrollAction} from '../../service/my';
import {getUserProfile} from '../../service/user';
import styles from './style';

const Item = List.Item;
const sexData = [
  {label: '男', value: '男'},
  {label: '女', value: '女'},
];
const ApplyInfo = (props) => {
  const navigation = useNavigation();
  const {
    route: {params},
  } = props;
  const [userProfileData, setUserProfileData] = useState({});
  const [num, setNum] = useState('');
  const [custName, setCustName] = useState('');
  const [phone, setPhone] = useState('');
  const [sex, setSex] = useState();
  useEffect(() => {
    // //设置    支付宝URL Schemes
    XPay.setAlipayScheme('alipay');
    getUserProfile().then((res) => {
      console.log(res.data);
      setUserProfileData(res.data);
    });
  }, []);

  const submit = () => {
    if (num && custName && phone && sex && sex?.length > 0) {
      if (!params?.fee) {
        enrollAction({
          erId: params?.erId,
          name: custName,
          num,
          orderId: null,
          phone,
          sex: sex[0],
        }).then((res) => {
          res.code === 200 && navigation.replace('MyApply');
        });
      } else {
        createOrder({
          actualPrice: params?.fee,
          couponId: '',
          couponName: '',
          createBy: params?.createBy,
          custAddress: '',
          custId: userProfileData?.custId,
          custName: userProfileData?.custName,
          freePrice: 0,
          isReceipt: 0,
          orderChannels: 2,
          orderId: null,
          orderNo: null,
          orderStatus: 0,
          orderType: 3,
          revision: 1,
          smOrderCmCourseList: [],
          totalPrice: params?.fee,
          receipt: {
            accountNumber: '',
            bankName: '',
            cardCode: '',
            headName: '',
            headType: 1,
            receiptDesc: 1,
            receiptKind: 1,
            unitAddress: '',
            unitPhone: '',
          },
        }).then((res) => {
          console.log(res);
          if (res.code === 200) {
            alipayAppPay({
              amt: res?.data?.actualPrice,
              billNo: res?.data?.orderNo,
              body: params?.erTitle,
              payType: '4',
              subject: '报名付款',
            }).then((orderRes) => {
              console.log(orderRes);
              //支付宝支付
              XPay.alipay(orderRes.msg, (result) => {
                console.log(result, 'result');
                if (result.resultStatus === '9000') {
                  enrollAction({
                    erId: params?.erId,
                    name: custName,
                    num,
                    orderId: res?.data?.orderNo,
                    phone,
                    sex: sex[0],
                  }).then((_res) => {
                    console.log(_res);
                    _res.code === 200 && navigation.replace('MyApply');
                  });
                } else {
                  Toast.fail('支付失败', 2);
                }
              });
            });
          }
        });
      }
    } else {
      Toast.info('请输入报名信息');
    }
  };

  return (
    <AreaView>
      <ScrollView style={styles.container}>
        <List>
          <Item
            extra={
              <TextInput
                value={custName}
                placeholder="请输入"
                style={styles.input}
                onChangeText={(val) => {
                  setCustName(val);
                }}
              />
            }>
            <Text style={styles.list_text}>姓名</Text>
          </Item>
        </List>
        <List>
          <Picker
            data={sexData}
            cols={1}
            value={sex}
            onChange={(val) => setSex(val)}>
            <List.Item>
              <Text style={styles.list_text}>性别</Text>
            </List.Item>
          </Picker>
        </List>

        <List>
          <Item
            extra={
              <TextInput
                placeholder="请输入"
                value={phone}
                style={styles.input}
                onChangeText={(val) => setPhone(val)}
              />
            }>
            <Text style={styles.list_text}>联系电话</Text>
          </Item>
          <Item
            extra={
              <TextInput
                placeholder="请输入"
                value={num}
                style={styles.input}
                onChangeText={(val) => setNum(val)}
              />
            }>
            <Text style={styles.list_text}>报名人数</Text>
          </Item>
          {!!params?.fee && (
            <Item extra={<Text style={styles.list_text}>支付宝</Text>}>
              <Text style={styles.list_text}>支付方式</Text>
            </Item>
          )}
        </List>
        <View style={styles.edit_container}>
          <TouchableOpacity  activeOpacity={1} style={styles.edit_btn} onPress={submit}>
            <Text style={styles.btn_text}>
              {params?.fee ? '支付并报名' : '报名'}
            </Text>
          </TouchableOpacity>
        </View>
      </ScrollView>
    </AreaView>
  );
};

export default ApplyInfo;
